<template>
  <view class="content pl30 pr30 bgc-fff">
    <u-form
      ref="uForm"
      :model="form"
      label-position="top"
    >
      <u-form-item
        required
        label="产品名称"
        prop="productName"
      >
		<view @click="show = true" style="color: #777777;"><text>{{form.productName || '请选择产品'}}</text></view>
      </u-form-item>

      <u-form-item
        required
        label="经销商金额"
        prop="dealerAmount"
      >
        <u-input
          v-model="form.dealerAmount"
          type="digit"
          placeholder="请输入经销商金额"
        />
      </u-form-item>
      <u-form-item
        required
        label="门店分账金额"
        prop="businessAmount"
      >
        <u-input
          v-model="form.businessAmount"
          type="digit"
          placeholder="请输入门店分账金额"
        />
      </u-form-item>
      <u-form-item
        required
        label="店小二上级奖励"
        prop="inviteParentAmount"
      >
        <u-input
          v-model="form.inviteParentAmount"
          type="digit"
          placeholder="请输入店小二上级奖励"
        />
      </u-form-item>
      <u-form-item
        required
        label="店小二奖励"
        prop="inviteAmount"
      >
        <u-input
          v-model="form.inviteAmount"
          type="digit"
          placeholder="请输入店小二奖励"
        />
      </u-form-item>

    </u-form>
    <u-select
      v-model="show"
      :list="proList"
      value-name="id"
      label-name="name"
      @confirm="handConfirm"
    />

    <footerBottom>
      <view
        class="pl30 pr30 z-flex z-flex-align-c"
        style="height: 100%;"
      >
        <view style="width: 100%;">
          <u-button
            :loading="btnLoading"
            :disabled="btnLoading"
            type="success"
            :custom-style="customStyle"
            shape="circle"
            @click="saveProVision"
          >
            完成
          </u-button>
        </view>
      </view>
    </footerBottom>
  </view>
</template>

<script>
import { getProEnumApi, getProDivisonApi, saveProDivisonApi } from '@/api/shop.js'
export default {
  data () {
    return {
      btnLoading: false,
      customStyle: {
        background: '#23bbb3'
      },
      show: false,
      proList: [],
      form: {
        productName: '',
        productId: '',
        inviteAmount: '',
        inviteParentAmount: '',
        businessAmount: '',
        dealerAmount: ''
      },
      rules: {
        productName: [{
          validator: (rule, value, callback) => {
            return value != ''
          },
          message: '请选择产品',
          trigger: ['change', 'blur'],
        }],
        dealerAmount: [{
          validator: (rule, value, callback) => {
            return value != ''
          },
          message: '请输入经销商金额',
          trigger: ['change', 'blur'],
        }],
        businessAmount: [{
          validator: (rule, value, callback) => {
            return value != ''
          },
          message: '请输入门店分账金额',
          trigger: ['change', 'blur'],
        }],
        inviteParentAmount: [{
          validator: (rule, value, callback) => {
            return value != ''
          },
          message: '请输入店小二上级奖励',
          trigger: ['change', 'blur'],
        }],
        inviteAmount: [{
          validator: (rule, value, callback) => {
            return value != ''
          },
          message: '请输入店小二奖励',
          trigger: ['change', 'blur'],
        }],
      }
    }
  },
  onShow () {
    this.$nextTick(() => {
      this.getProEnumList()
    })
  },
  methods: {
    async getProEnumList () {
      const { code, data } = await getProEnumApi()
      if (code != 0) return
      this.proList = data.list.map(it => {
        return {
          id: it.id,
          name: it.businessName + '-' + it.name
        }
      })
    },
    async getProVision () {
      const productId = this.form.productId
      const { code, data } = await getProDivisonApi({ productId })
      if (code != 0) return
      if (data.productName) {
        this.form = data
      } else {
        this.form.inviteAmount = ''
        this.form.inviteParentAmount = ''
        this.form.businessAmount = ''
        this.form.dealerAmount = ''
      }
    },
    async saveProVision () {
		this.$refs.uForm.validate(async (valid) => {
		if (valid) {
			this.btnLoading = true
			this.form.inviteAmount = Number(this.form.inviteAmount)
			this.form.inviteParentAmount = Number(this.form.inviteParentAmount)
			this.form.businessAmount = Number(this.form.businessAmount)
			this.form.dealerAmount = Number(this.form.dealerAmount)
			const { code, data } = await saveProDivisonApi(this.form)
			this.btnLoading = false
			if (code == 0){
				uni.showToast({
					title: '保存成功'
				})
				setTimeout(()=>{
					uni.navigateBack()
				},500)
			}
		}
      })
    },
    handConfirm (e) {
      this.form.productId = Number(e[0]['value'])
      this.form.productName = e[0]['label']
      this.getProVision()
    }
  }
}
</script>

<style scoped lang="scss">
</style>
